<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <base href="<%=basePath%>">
    <title>大学生社团主页</title>
    <link href="/css/add.css" type="text/css" rel="stylesheet">
    <link href="/css/clubHome.css" type="text/css" rel="stylesheet">
    <link href="/css/layui.css" type="text/css" rel="stylesheet">
    <script src="/js/jquery-3.7.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(() => {
            $(".reply_btn").click(function () {
                // 不显示全部的回复评论框
                $("[class=reply_form]").css({"display": "none"});
                //显示当前的回复评论框
                $(this).parent().parent().parent().parent()
                    .next().next().css({"display":"block"});
            })
        })
    </script>
</head>

<body>
<div id="up">
    <ul>
        <li><span><a href="">社团 </a>> 留言板 ></span></li>
    </ul>
</div>
<div class="container">
    <div>
        <div>
            <c:if test="${commentListGetCommentAllById=='getCommentAllById'}">
                <h1 style="font-size: 20px">个人</h1>
            </c:if>
            <h1 style="font-size: 20px">留言板</h1>
        </div>
        <div>
            <form action="/comment/addComment">
                <input type="text" name="content" class="layui-input" style="width: 50%;float:left; "/>
                <input type="hidden" name="id" value=${user2.id}>
                <input type="submit" class="button" value="提交评论">
            </form>
        </div>
        <p style="height: 30px;"></p>
    </div>

    <div>
        <c:forEach items="${commentList}" var="comment" varStatus="status">
            <div class="product">
                <div class="product-info">
                    <div>
                        <span> ${comment.user.name} </span>
                    </div>
                    <div>
                        <span> 评论：${comment.plContent} </span>
                    </div>
                    <div>
                        <span>
                            ${comment.id}楼
                            <fmt:formatDate value="${comment.plTime}" pattern="yyyy-MM-dd"/>
                            <span class="reply_btn">回复评论</span>
                            <span>
                            <c:if test="${user2.rid==1 || comment.userId==user2.id}">
                                <a href="/comment/deleteCommentById?id=${comment.id}"
                                   onclick="return confirm('是否确定删除？')"> 删除评论</a>
                            </c:if>
                            </span>
                        </span>
                    </div>
                </div>
            </div>
            <div style="margin-left: 2ex;">
                <c:forEach items="${comment.comments}" var="subcomment" varStatus="status">
                    <div class="product">
                        <div class="product-info">
                            <div>
                                <span> ${subcomment.user.name} </span>
                            </div>
                            <div>
                                <span> 评论：${subcomment.plContent} </span>
                            </div>
                            <div>
                                <span>  ${subcomment.id}楼</span>
                                <span> <fmt:formatDate value="${subcomment.plTime}" pattern="yyyy-MM-dd"/></span>
                                <span>
                                    <c:if test="${user2.rid==1 || subcomment.userId==user2.id}">
                                        <a href="/comment/deleteCommentById?id=${subcomment.id}"
                                           onclick="return confirm('是否确定删除？')"> 删除评论</a>
                                    </c:if>
                                </span>
                            </div>
                        </div>
                    </div>
                </c:forEach>
            </div>
            <div class="reply_form" style="display:none;">
                <form action="/comment/addCommentReply">
                    <input type="text" name="content" style="width: 50%; float:left;" class="layui-input"
                           placeholder="评论${comment.id}楼:"/>
                    <input type="hidden" name="id" value=${user2.id}>
                    <input type="hidden" name="pid" value=${comment.id}>
                    <input type="submit" class="button" value="发布">
                </form>
            </div>
            <hr>
        </c:forEach>
    </div>
    <p>加载中。。。</p>
</div>
</body>
</html>
